<template>
  <i :style="style" :class="bem.b('')">
    <slot></slot>
  </i>
</template>

<script setup lang="ts">
import { createNameSpace } from "snoby-utils";
import { iconProps } from "./props";
import { computed } from "vue";
defineOptions({
  name: "sno-icon",
});
const bem = createNameSpace("icon");
const props = defineProps(iconProps);
const style = computed(() => {
  if (!props.color && !props.size) return {};
  return {
    ...(props.size ? { fontSize: props.size + "px" } : {}),
    ...(props.color ? { color: props.color } : {}),
  };
});
</script>
